@extends('admin.layout')
@section('content')
    <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
        <div class="col-md-12" >
            <div class="app_content_div" id="app_content_div_301Index">
                <h3>编辑视频</h3>
            </div>
            <form class="form-horizontal">
                <div class="form-group">
                    <label for="title" class="col-sm-2 control-label"><span style="color:red;">*</span>标题</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="title" name="title" value="{{$oVideo->title}}">
                    </div>
                </div>
                <div class="form-group">
                    <label for="video" class="col-sm-2 control-label"><span style="color:red;">*</span>视频路径</label>
                    <div class="col-sm-10">
                        <input  id="video" name="video" class="form-control"  type="text" value="{{$oVideo->video}}" >
                    </div>
                </div>
                <div class="form-group">
                    <label for="type" class="col-sm-2 control-label"><span style="color:red;">*</span>视频类型</label>
                    <div class="col-sm-10">
                        <label class="radio-inline">
                            <input type="radio" name="type" id="video_type1" value="1" checked> 录播
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="type" id="video_type2" value="0"> 直播
                        </label>
                    </div>
                </div>
                <div class="form-group" >
                    <label for="description" class="col-sm-2 control-label"><span style="color:red;">*</span>课程简介</label>
                    <div class="col-sm-10">
                        <script id="description" name="description" type="text/plain">{{$oVideo->description}}</script>
                        <script type="text/javascript">
                            var editor = UE.getEditor('description')
                        </script>
                    </div>
                </div>
                <div class="form-group">
                    <label for="start_time" class="col-sm-2 control-label"><span style="color:red;">*</span>直播开始时间</label>
                    <div class="col-sm-10">
                        <input type="datetime-local" step="1" class="form-control ui_timepicker" id="start_at" name="start_at" value="{{$oVideo->start_at}}">
                    </div>
                </div>
                <div class="form-group">
                    <label for="end_time" class="col-sm-2 control-label"><span style="color:red;">*</span>直播结束时间</label>
                    <div class="col-sm-10">
                        <input type="datetime-local" step="1" class="form-control ui_timepicker" id="end_at" name="end_at" value="{{$oVideo->end_at}}">
                    </div>
                </div>
                <div class="form-group">
                    <label for="upload_file" class="col-sm-2 control-label"><span style="color:red;">*</span>缩略图</label>
                    <div class="col-sm-10">
                        <input  id="image" name="image"  type="file"  onchange="previewImage()"/>
                        <div id="image-container" style="height: 200px;width: 200px" ><img style="height: 200px;width: 200px" src="{{$oVideo->image}}"></div>
                    </div>
                    <div class="form-group">
                        <label for="expert_id" class="col-sm-2 control-label"><span style="color:red;">*</span>关联专家</label>
                        <div class="col-sm-10" value=" {{$oVideo->expert_id}}">
                            <select id="expert_id">
                                @foreach($oExpert as $v)
                                    <option value="{{$v->id}}">姓名:{{$v->name}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            <button type="button" onclick="edit()" class="btn btn-default">确定</button>
                        </div>
                    </div>
            </form>
        </div>
    </div>
    <script>
        function edit(){

            var title= $('#title').val();
            var video = $('#video').val();
            var type = $("[name='type']:checked").eq(0).val();
            let description=editor.getContentTxt();
            var start_at = $('#start_at').val();
            var end_at= $('#end_at').val();
            var expert_id= $('#expert_id').val();

            $.ajaxFileUpload({
                url: '/adm/video/edit/{{$oVideo->id}}',
                type: 'put',
                fileElementId:'image',
                dataType: 'json',
                data: {
                    'title':title,
                    'type': type,
                    'description': description,
                    'video':video,
                    'start_at': start_at,
                    'end_at': end_at,
                    'expert_id':expert_id,
                    '_token': '{{csrf_token()}}'
                },
                success: function (data) {
                    if (data.success) {
                        alert(data.msg);
                        location.href = '/adm/video/video-list';
                    } else {
                        alert(data.msg);
                    }
                }
            });

        }
        function previewImage() {
            var file = document.getElementById("image").files[0];
            var reader = new FileReader();
            reader.onload = function(e) {
                var img = document.createElement("img");
                img.src = e.target.result;
                img.width = 200; // 设置宽度为200像素
                img.height = 200; // 设置高度为200像素
                var container = document.getElementById('image-container');
                while (container.firstChild) {
                    container.removeChild(container.firstChild);
                }
                // 添加新的图片
                container.appendChild(img);
                alert("上传成功！")
            }
            reader.readAsDataURL(file);
        }
    </script>

@endsection

